<template>
	<view class="PopFilter">
		<uv-popup ref="popup" mode='bottom' round="16" custom-style="min-height: 200rpx;">

			<view class="poptop">
				<image src='@/static/img/logo.png'></image>
				<view class="">测试</view>
				<view class="">-评分</view>
			</view>

			<uv-line></uv-line>



			<view class="card">
				<uv-rate active-color="#FFC233" :count="count" v-model="score"></uv-rate>
			</view>




			<uv-line></uv-line>



			<uv-tabbar :border="false" :customStyle="{height:'120rpx'}">
				<view class="footerbox">
					<uv-button block text="确定" @click="save"></uv-button>
				</view>
			</uv-tabbar>


		</uv-popup>
	</view>
</template>
<script lang="ts" setup>
	import { ref, defineEmits, defineProps } from 'vue';
	import { onLoad } from '@dcloudio/uni-app';
	import { http, apiPath } from '@/common/http/index';
	import { toast } from '@/utils/fun';
	const emit = defineEmits(['onConfirm']);

	// 使用defineProps定义接收的props defineProps,
	const props = defineProps({
		score: {
			type: [Number, String],
			default: ''
		},
		storage_id: {
			type: Number,
			default: 0
		},
		type: {
			type: Number,
			default: 0
		}
	});


	const count = ref(10);
	const score = ref(0) as any

	const popup = ref();
	const open = () => {
		score.value = props.score;
		popup.value.open();
		console.log('内部打开', score.value)

	};
	defineExpose({ open });

	onLoad(() => {

	});

	const loading = ref(false)
	const save = () => {
		if (loading.value) return

		loading.value = true;
		const data = {
			score: score.value, storage_id: props.storage_id, type: props.type
		};
		http
			.post(`/app/comment/addData`, data, { custom: { loading: true } })
			.then(() => {
				popup.value.close()
				toast('评分成功')
				setTimeout(() => {
					emit('onConfirm');
					loading.value = false;
				}, 1500)
			})
			.catch(() => {
				setTimeout(() => {
					loading.value = false;
				}, 1500)
			});

	}
</script>
<style lang="scss" scoped>
	.popupbox {
		width: 100%;
		padding: 0 28rpx 28rpx;
	}

	.poptop {
		padding: 30rpx;
		display: flex;
		align-items: center;
		color: #999;
		font-size: 24rpx;
		line-height: 1;

		image {
			width: 40rpx;
			height: 40rpx;
			display: block;
		}
	}


	.footerbox {
		width: 100%;
		height: 100%;
		padding: 20rpx 30rpx;

	}

	.card {
		background: #f8f8f8;
		padding: 80rpx 30rpx;
	}
</style>